<template>
  <div class="pageWrapper">
    <SearchBar @onSearch="handleSearch">
      <SearchBarItem label="清分对账主键:" :labelLg="8">
        <Input type="text" v-model="dataModule.name" placeholder="请输入" clearable />
      </SearchBarItem>
      <SearchBarItem label="对账时间:" :labelLg="8">
        <DatePicker type="daterange" split-panels placeholder="请输入"></DatePicker>
      </SearchBarItem>
    </SearchBar>
    <RemoteTable :namespace="namespace" :columns="columns" @onSortChange="onSortChange"></RemoteTable>
  </div>
</template>

<script>
  import {
    Button,
    Input,
    Modal,
    Message,
    Col,
    Row,
    Form,
    FormItem,
    DatePicker,
    Select,
    Option
  } from "view-design";
  import RemoteTable from "@/components/RemoteTable";
  import SearchBar from "@/components/SearchBar";
  import RemoteSelect from "@/components/RemoteSelect";
  import Action from "./Action"
  import {
    namespace
  } from "../module";
  import Authc from "@/components/Authc";
  import config from "@/utils/config";
  import appService from "@/utils/appService";
  export default {
    name: 'tables_page',
    components: {
     RemoteTable,
     SearchBar,
     SearchBarItem: SearchBar.SearchBarItem,
     RemoteSelect,
     Authc,
     Button,
     Action,
     Input,
     Modal,
     Message,
     Col,
     Row,
     Form,
     FormItem,
     DatePicker,
     Select,
     Option
    },
    data() {
      return {
        requireUrl: '',
        namespace: namespace,
        isClear: true,
        loading: true,
        modal1: false,
        tableData: [],
        dataModule: {

        },
        columns: [{
            type: 'index',
            width: 60,
            align: 'center'
          }, {
            title: '清分对账主键',
            key: 'name',
          },
          {
            title: '主订单号',
            key: 'email',
          },
          {
            title: '清分批号',
            key: 'createTime',
          }, {
            title: '清分执行时间',
            key: 'name',
          },
          {
            title: '招行订单号',
            key: 'email',
          },
          {
            title: '子订单号',
            key: 'createTime',
          },
          {
            title: '交易时间',
            key: 'email',
          },
          {
            title: '业务渠道',
            key: 'createTime',
          }, {
            title: '付款方账户',
            key: 'name',
          },
          {
            title: '付款方账户名称',
            key: 'email',
          },
          {
            title: '收款方账户',
            key: 'createTime',
          },
          {
            title: '支付金额',
            key: 'createTime',
          },
          {
            title: '收款方账户名称',
            key: 'createTime',
          },
          {
            title: '商户编码',
            key: 'createTime',
          },
          // {
          //   title: '商户名称',
          //   key: 'createTime',
          // },
          // {
          //   title: '原始订单金额',
          //   key: 'createTime',
          // },
          // {
          //   title: '清分金额',
          //   key: 'createTime',
          // },
          // {
          //   title: '原始清分金额',
          //   key: 'createTime',
          // },
          // {
          //   title: '对账时间',
          //   key: 'createTime',
          // },
          // {
          //   title: '对账状态',
          //   key: 'createTime',
          // },
          // {
          //   title: '订单状态',
          //   key: 'createTime',
          // },
          // {
          //   title: '对账结果',
          //   key: 'createTime',
          // },

          // {
          //   title: '创建时间',
          //   key: 'createTime',
          // },
          // {
          //   title: '备注',
          //   key: 'createTime',
          // },
          // {
          //   title: '操作',
          //   key: 'handle',
          //   width: 160,
          //   options: ['delete', 'check', 'edit'],
          //   buttons: [
          //     (h, params, vm) => {
          //       return this.dealBtnsOPeration(h, params, vm)
          //     }
          //   ]
          // }
        ]
      }
    },
    methods: {
      handleSearch() {
        this.$store.dispatch(`${namespace}/query`, {
          limit: {
            currentPage: 1
          }
        });
      },
      onSortChange(sort) {
        if (sort.order === "normal") {
          this.queryParam.order = [];
        } else {
          this.queryParam.order = [sort.key + " " + sort.order];
        }
        this.handleSearch();
      },
      onSortChange(sort) {
        if (sort.order === "normal") {
          this.queryParam.order = [];
        } else {
          this.queryParam.order = [sort.key + " " + sort.order];
        }
        this.handleSearch();
      },
      resetForm() {
        this.$refs['formArea'].resetFields()
      }
    },
    async mounted() {
      
    }
  }
</script>

<style>

</style>
